<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="app">
    <input type="button" value="浪起来" v-on:click="lang">
    <input type="button" value="低调" v-on:click="ting">
    <h3>{{msg}}</h3>
</div>

<script src="lib/vue.js"></script>
<script>
    var vm=new Vue({
        el:"#app",
        data:{
            msg:"猥琐发育，别浪···",
            intervalId:null
        },
        methods:{
            lang:function () {
                if(this.intervalId !=null){return;}
                //箭头函数  去掉function  加上=>  this指向不变
                this.intervalId=setInterval(() => {
                    // var msgtt=this.msg
                    // // msgtt[1,]+msgtt[0]
                    // return msgtt[1]+msgtt[0]
                    var start=this.msg.substring(0,1)
                    var end=this.msg.substring(1)
                    this.msg=end+start
                },400)
            },
            ting:function () {
                clearInterval(this.intervalId)
                this.intervalId=null
            }
        }
    })
</script>

</body>
</html>